<template>
  <div>
    <div id="compare_one" style="height: 420px"></div>
  </div>
</template>

<script>
import * as echarts from "echarts";
export default {
  props: ["myStart", "myEnd"],
  data() {
    return {
      start: this.myStart,
      end: this.myEnd,
      bacdata: [],
      masdata: [],
    };
  },
  mounted() {
    if (!this.start || !this.end) {
      this.axios({
        url: "grad/yearList",
        methods: "get",
      }).then((res) => {
        let years = res.data.data;

        years = years.sort(function (a, b) {
          return a - b;
        });

        //默认为最近一年
        this.start = years[years.length - 1];
        this.end = years[years.length - 1];
        this.get_direction(this.start, this.end);
      });
    } else {
      this.get_direction(this.start, this.end);
    }
  },
  computed: {
    myChart() {
      return echarts.init(document.getElementById("compare_one"));
    },
  },
  methods: {
    get_direction(start, end) {
      this.axios({
        url: "grad/direction",
        method: "get",
        params: {
          start: start,
          end: end,
        },
        headers: {
          "Content-Type": "application/x-www-form-urlencoded;charset=utf-8",
        },
      })
        .then((res) => {
          var bachelor = this.count_kind(res.data.data.bachelor);
          var master = this.count_kind(res.data.data.master);
          var sum = [];
          var bac_percent = [];
          var mas_percent = [];
          var sum_percent = [];
          for (var i in bachelor) {
            sum.push(bachelor[i] + master[i]);
            bac_percent.push(
              ((bachelor[i] / bachelor[0]) * 100).toFixed(2) + " %"
            );
            mas_percent.push(((master[i] / master[0]) * 100).toFixed(2) + " %");
            sum_percent.push(
              (
                ((bachelor[i] + master[i]) / (bachelor[0] + master[0])) *
                100
              ).toFixed(2) + " %"
            );
          }
          var title = [
            "升学",
            "就业",
            "未就业",
            "国内",
            "出国（出境）",
            "协议和合同就业",
            "其他录用形式就业",
          ];
          // 组织数据
          var table = [];
          for (var i = 0; i < 5; i++) {
            var temp = {
              aim: "1",
              item: "1",
              bach_num: "1",
              mas_num: "1",
              sum_num: "1",
              bac_percent: "1",
              mas_percent: "1",
              sum_percent: "1",
            };
            table[i] = temp;
          }

          // 升学
          for (let i = 0; i < 2; i++) {
            table[i].aim = title[0];
            table[i].item = title[i + 3];
            table[i].bach_num = bachelor[i + 4];
            table[i].mas_num = master[i + 4];
            table[i].sum_num = sum[i + 4];
            table[i].bac_percent = bac_percent[i + 4];
            table[i].mas_percent = mas_percent[i + 4];
            table[i].sum_percent = sum_percent[i + 4];
          }
          //  就业
          for (let i = 2; i < 4; i++) {
            table[i].aim = title[1];
            table[i].item = title[i + 3];
            table[i].bach_num = bachelor[i + 4];
            table[i].mas_num = master[i + 4];
            table[i].sum_num = sum[i + 4];
            table[i].bac_percent = bac_percent[i + 4];
            table[i].mas_percent = mas_percent[i + 4];
            table[i].sum_percent = sum_percent[i + 4];
          }
          // 未就业
          table[4].aim = title[2];
          table[4].item = title[2];
          table[4].bach_num = bachelor[3];
          table[4].mas_num = master[3];
          table[4].sum_num = sum[3];
          table[4].bac_percent = bac_percent[3];
          table[4].mas_percent = mas_percent[3];
          table[4].sum_percent = sum_percent[3];
          // 本科生funetine
          let bach_res = [];
          for (var i in table) {
            var temp = {};
            temp.name = table[i].item;
            temp.value = table[i].bach_num;
            bach_res.push(temp);
          }
          // 研究生
          let mas_res = [];
          for (var i in table) {
            var temp = {};
            temp.name = table[i].item;
            temp.value = table[i].mas_num;
            mas_res.push(temp);
          }
          this.bacdata = bach_res;
          this.masdata = mas_res;
          this.$nextTick(() => {
            this.drawChart();
          });
        })
        .catch((err) => {
          console.log(err);
        });
    },
    count_kind(data) {
      var job_onwork = 0; //签就业协议
      var bound_study = 0; //境内升学
      var aborad = 0; //出国出境
      var flexible = 0;
      var nl = 0;
      var sum = 0;
      for (var i in data) {
        var cur = data[i]["term"];
        var num = data[i]["num"];
        if (cur == "签就业协议形式就业") {
          job_onwork += num;
        } else if (cur == "签劳动合同形式就业") {
          job_onwork += num;
        } else if (cur == "出国、出境") {
          aborad += num;
        } else if (cur == "境内升学") {
          bound_study += num;
        } else if (cur == null) { //未就业
          nl += num;
        } else if(cur == "其他录用形式就业"){
          flexible += num;  //其他录用形式就业
        }
        sum += num;
      }
      var study = bound_study + aborad;  //
      var job = job_onwork + flexible;
      return [sum, study, job, nl, bound_study, aborad, job_onwork, flexible];
    },
    drawChart() {
      echarts.init(document.getElementById("compare_one")).dispose();
      this.myChart = echarts.init(document.getElementById("compare_one"));
      let that = this;
      console.log(this.bacdata);
      this.myChart.setOption({
        tooltip: {
          trigger: "axis",
          axisPointer: {
            // 坐标轴指示器，坐标轴触发有效
            type: "shadow", // 默认为直线，可选为：'line' | 'shadow'
          },
        },
        toolbox: {
          x: 950,
          feature: {
            saveAsImage: { show: true },
          },
        },
        legend: {
          data: ["本科生", "研究生"],
          bottom: "bottom",
        },
        grid: {
          height: 300,
          containLabel: true,
        },
        xAxis: [
          {
            type: "value",
          },
        ],
        yAxis: [
          {
            type: "category",
            axisTick: {
              show: false,
            },
            data: [
              "国内",
              "出国（出境）",
              "协议和合同就业",
              "其他录用形式就业",
              "未就业",
            ],
          },
        ],
        series: [
          {
            name: "本科生",
            type: "bar",
            stack: "总量",
            barWidth: 30,
            label: {
              show: true,
            },
            emphasis: {
              focus: "series",
            },
            data: that.bacdata,
          },
          {
            name: "研究生",
            type: "bar",
            stack: "总量",
            barWidth: 30,
            label: {
              show: true,
              position: "right",
            },
            emphasis: {
              focus: "series",
            },
            data: that.masdata,
          },
        ],
      });
    },
    resize() {
      this.myChart.resize();
    },
  },
};
</script>
